今天要來講得就是網頁背景的設計，你可以用單一的顏色，也可以放圖片，或者製作多層次的背景設計，都是使用background系列的屬性喔!

背景 background

關於背景的設定有一些不同呈現方式的屬性:

• background-color
• background-image
• background-repeat
• background-position

這是比較常用的幾個屬性，來介紹一下!

background-color

顧名思義就是對背景的顏色設定，上一篇我們有說到CSS的顏色語法，background-color其實也就是把原本color放屬性的地方改成background-color而已

p {background-color: #33CCFF;}

這裡就是單純對某一個區塊的背景指定顏色。

background-image,background-repeat ,background-position

誰說背景只能有單純的顏色的，有時候我們也可以以圖片作為整個網站的背景，或是某一區塊(div、span)的小小背景也是可以的喔!
把這三個屬性擺在一起說明，因為他們常都是一起搭配的。先看範例!

p{
    background-image: url('圖片路徑');
    background-repeat: no-repeat;
    background-position: center;
}

background-image的使用語法和我們在HTML的插入圖片很像，只要在url('')內貼上圖片的路徑就可以成功出現了喔!
background-repeat是在決定指定的背景圖案要不要重複擺放，如果沒有特別設定，background-repeat就會自行往x及y的方向重複(預設值為repeat)。
那麼background-position呢。就是在定義背景圖片最一開始要出現的位置，通常我們會使用top、center、bottom來決定上中下，後面可以再加上left、center、right，設定靠左或靠右。